:root {
  --color-red: #ea120f;
  --color-blue: #567bea;
  --color-skyBlue: #36ead9;
  --color-green: #28bd2d;
  --color-yellow: #f1cd52;
  --color-orange: #f15715;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-666: #666;
  --color-999: #999;
  --color-eee: #eee; }

.c-red {
  color: var(color-red); }

.c-blue {
  color: var(color-blue); }

.c-skyBlue {
  color: var(color-skyBlue); }

.c-green {
  color: var(color-green); }

.c-fff {
  color: var(color-fff); }

.c-0 {
  color: var(color-0); }

.c-white {
  color: var(color-white); }

.c-black {
  color: var(color-black); }

.c-666 {
  color: var(color-666); }

.c-999 {
  color: var(color-999); }

.c-eee {
  color: var(color-eee); }

.bgc-red {
  background-color: var(color-red); }

.bgc-blue {
  background-color: var(color-blue); }

.bgc-skyBlue {
  background-color: var(color-skyBlue); }

.bgc-green {
  background-color: var(color-green); }

.bgc-fff {
  background-color: var(color-fff); }

.bgc-0 {
  background-color: var(color-0); }

.bgc-white {
  background-color: var(color-white); }

.bgc-black {
  background-color: var(color-black); }

.bgc-666 {
  background-color: var(color-666); }

.bgc-999 {
  background-color: var(color-999); }

.bgc-eee {
  background-color: var(color-eee); }

.bc-red {
  border-color: var(color-red); }

.bc-blue {
  border-color: var(color-blue); }

.bc-skyBlue {
  border-color: var(color-skyBlue); }

.bc-green {
  border-color: var(color-green); }

.bc-fff {
  border-color: var(color-fff); }

.bc-0 {
  border-color: var(color-0); }

.bc-white {
  border-color: var(color-white); }

.bc-black {
  border-color: var(color-black); }

.bc-666 {
  border-color: var(color-666); }

.bc-999 {
  border-color: var(color-999); }

.bc-eee {
  border-color: var(color-eee); }

.row {
  display: flex;
  flex-flow: row nowrap; }

.column {
  display: flex;
  flex-flow: column nowrap; }

.rowi {
  display: inline-flex;
  flex-flow: row nowrap; }

.columni {
  display: inline-flex;
  flex-flow: column nowrap; }

.jcc {
  justify-content: center; }

.jcl {
  justify-content: flex-end; }

.jcr {
  justify-content: flex-start; }

.jca {
  justify-content: space-around; }

.jcb {
  justify-content: space-between; }

.jce {
  justify-content: space-evenly; }

.aic {
  align-items: center; }

.aie {
  align-items: flex-end; }

.ais {
  align-items: flex-start; }

.aib {
  align-items: baseline; }

.aia {
  align-items: stretch; }

flex-1 {
  flex: 1; }

flex-2 {
  flex: 2; }

flex-3 {
  flex: 3; }

flex-4 {
  flex: 4; }

flex-5 {
  flex: 5; }

flex-6 {
  flex: 6; }

flex-7 {
  flex: 7; }

flex-8 {
  flex: 8; }

flex-9 {
  flex: 9; }

flex-10 {
  flex: 10; }

flex-11 {
  flex: 11; }

flex-12 {
  flex: 12; }

.fdr {
  flex-direction: row; }

.fdr_ {
  flex-direction: row-reverse; }

.fdc {
  flex-direction: column; }

.fdc_ {
  flex-direction: column-reverse; }

.fwn {
  flex-wrap: nowrap; }

.fww {
  flex-wrap: wrap; }

.fwr {
  flex-wrap: wrap-reverse; }

.acs {
  align-content: flex-start; }

.ace {
  align-content: flex-end; }

.acc {
  align-content: center; }

.acb {
  align-content: space-between; }

.aca {
  align-content: space-around; }

.acst {
  align-content: stretch; }

flex-1 {
  flex-grow: 1; }

flex-2 {
  flex-grow: 2; }

flex-3 {
  flex-grow: 3; }

flex-4 {
  flex-grow: 4; }

flex-5 {
  flex-grow: 5; }

flex-6 {
  flex-grow: 6; }

flex-7 {
  flex-grow: 7; }

flex-8 {
  flex-grow: 8; }

flex-9 {
  flex-grow: 9; }

flex-10 {
  flex-grow: 10; }

flex-11 {
  flex-grow: 11; }

flex-12 {
  flex-grow: 12; }

flex-1 {
  flex-shrink: 1; }

flex-2 {
  flex-shrink: 2; }

flex-3 {
  flex-shrink: 3; }

flex-4 {
  flex-shrink: 4; }

flex-5 {
  flex-shrink: 5; }

flex-6 {
  flex-shrink: 6; }

flex-7 {
  flex-shrink: 7; }

flex-8 {
  flex-shrink: 8; }

flex-9 {
  flex-shrink: 9; }

flex-10 {
  flex-shrink: 10; }

flex-11 {
  flex-shrink: 11; }

flex-12 {
  flex-shrink: 12; }

.asc {
  align-self: center; }

.ase {
  align-self: flex-end; }

.ass {
  align-self: flex-start; }

.asb {
  align-self: baseline; }

.asst {
  align-self: stretch; }

.asa {
  align-self: auto; }

.f5 {
  font-size: 10px; }

.f6 {
  font-size: 12px; }

.f7 {
  font-size: 14px; }

.f8 {
  font-size: 16px; }

.f9 {
  font-size: 18px; }

.f10 {
  font-size: 20px; }

.f11 {
  font-size: 22px; }

.f12 {
  font-size: 24px; }

.f13 {
  font-size: 26px; }

.f14 {
  font-size: 28px; }

.f15 {
  font-size: 30px; }

.f16 {
  font-size: 32px; }

.f17 {
  font-size: 34px; }

.f18 {
  font-size: 36px; }

.f19 {
  font-size: 38px; }

.f20 {
  font-size: 40px; }
